<template>
	<view class="wrap">
		<view class="content">
			<view class="title">来一句与众不同的搭讪</view>
			<view class="desc">
				<u-textarea font-size="24rpx" placeholder-color="#999999" v-model="desc" height="80" maxlength="100" count></u-textarea>
			</view>
		</view>

		<block v-if="addNum > 0">
			<view class="add_btn" @click="addFriend">
				发送好友申请
				<!-- <view class="super_member">
					会员专享
				</view> -->
			</view>
			<view class="add_tip">今日剩余添加好友数 {{ addNum }}</view>
		</block>
		<block v-if="addNum <= 0">
			<view class="add_btn_n">发送好友申请</view>
			<!-- <block>
				<view class="add_tip" v-if="userInfo.UserType == '普通用户'">
					开通金卡或黑金卡会员，每日可以添加好友，点击
					<text class="r3" @click="upgrade">开通会员</text>
				</view>
				
				<view class="add_tip" v-else-if="addNum <= 0">
					今日加好友已达上限，你可以
					<text class="r3" @click="upgrade">升级会员</text>
					获得更多权益
				</view>
			</block> -->
			<view class="add_tip" v-if="addNum <= 0">
				今日加好友已达上限，你可以
				<text class="r3" @click="upgrade">升级会员</text>
				获得更多权益
			</view>
			
		</block>
	</view>
</template>

<script>
export default {
	data() {
		return {
			descPlaceholder: '我是###，很高兴遇见你...',
			desc: '',
			friendId: '',
			friendName: '',
			addNum: 0,
			userInfo: []
		};
	},

	methods: {
		async upgrade() {
			this.nav_to('/pages/user/apply_member');
		},
		async addFriend() {
			console.log('1111');
			if (!this.desc) {
				this.$pv.msg('加人家好友，总要说点什么吧');
				return;
			}

			let userType = uni.getStorageSync('user').UserType;
			try {
				let res = await this.$api.post('/Friend/Add', {
					FriendID: this.friendId,
					Remark: this.desc
				});
			
				let fid = res.data;
			
				if (res.data) {
					this.$pv.msg('已发送请求');
						setTimeout(() => { uni.navigateBack() }, 1500)
				} else {
					this.$pv.msg(res.message);
				}
			} catch (error) {
				this.$pv.msg('添加失败   ');
			}
			
			
			// if (userType != '普通用户') {
			// 	try {
			// 		let res = await this.$api.post('/Friend/Add', {
			// 			FriendID: this.friendId,
			// 			Remark: this.desc
			// 		});

			// 		let fid = res.data;

			// 		if (res.data) {
			// 			this.$pv.msg('已发送请求');
			// 				setTimeout(() => { uni.navigateBack() }, 1500)
			// 		} else {
			// 			this.$pv.msg(res.message);
			// 		}
			// 	} catch (error) {
			// 		this.$pv.msg('添加失败   ');
			// 	}
			// } else {
			// 	let _this = this;
			// 	uni.showModal({
			// 		title: '会员专享',
			// 		content: '加好友是会员特权,去开通会员吧',
			// 		confirmText: '去开通',
			// 		success: function (res) {
			// 			if (res.confirm) {
			// 				_this.nav_to('/pages/user/apply_member');
			// 			} else if (res.cancel) {
			// 			}
			// 		}
			// 	});
			// }
		}
	},

	async onLoad(e) {
		this.friendId = e.user_id;

		let opp_u = await this.$api.post('/User/GetUserInfo', {
			ID: this.friendId
		});
		if (!opp_u.data) {
			this.$pv.msg('该用户不存在');

			setTimeout(() => {
				uni.navigateBack();
			}, 500);
		}

		this.friendName = opp_u.data.Name;

		const user = uni.getStorageSync('user');
		await this.$api.post('/Common/Add_ViewPath', {
			Path: 'add_friend',
			Platform: uni.getStorageSync('platform')
		});

		let u = await this.$api.post('/User/GetUserInfo', {
			ID: user.UserID
		});
		if (u.data) this.userInfo = u.data;

		this.desc = this.descPlaceholder.replace('###', this.$util.entitiesToUtf16(this.userInfo.Name) || '');

		let res = await this.$api.post('/Friend/GetTodayFriendNum');
		if (res.data) this.addNum = res.data;
	}
};
</script>

<style lang="scss">
page {
	background: #f6f6f6;
}
.content {
	background-color: #fff;
	padding-bottom: 20rpx;
	margin-top: 20rpx;
	padding: 20rpx 20rpx;
	box-sizing: border-box;
	.title {
		font-size: 32rpx;
		color: #333333;
		margin-bottom: 24rpx;
		margin-left: 22rpx;
	}

	.desc {
		margin-bottom: 48rpx;
		width: 95%;
		margin: 0 auto;
		.u-textarea {
			background: #f8f8f8;
			color: #24242b;
		}
		.u-border {
			border-style: none;
		}
	}
}
.u-textarea__count {
	padding: 14rpx 8rpx !important;
	background-color: transparent !important;
	font-size: 24rpx !important;
	color: #999999 !important;
}
.u-textarea__field {
	font-size: 28rpx !important;
	color: #999999 !important;
}
.wrap {
	// padding: 44rpx 54rpx 0 54rpx;

	.add_btn {
		// padding: 20rpx 40rpx;
		width: 670rpx;
		height: 92rpx;
		text-align: center;
		line-height: 92rpx;
		font-size: 32rpx;
		color: #fff;
		background: #0d0d0d;
		position: relative;
		// box-shadow: 0rpx 1rpx 6rpx black;
		border-radius: 44rpx;
		margin: 30rpx auto;
		.super_member {
			position: absolute;
			top: -16rpx;
			right: -16rpx;
			color: black;
			background: linear-gradient(135deg, #fd9604 0%, #dc3518 100%);
			// padding: 6rpx 10rpx;
			border-radius: 12rpx;
		}
	}

	.add_btn_n {
		width: 670rpx;
		height: 92rpx;
		text-align: center;
		line-height: 92rpx;
		margin: 30rpx auto;
		text-align: center;
		color: black;
		background: linear-gradient(180deg, #fefefe 0%, #b9b9b9 100%);
		position: relative;
		box-shadow: 0rpx 1rpx 6rpx black;
		border-radius: 50rpx;
	}

	.add_tip {
		font-size: 24rpx;
		text-align: center;
		margin-top: 20rpx;
	}

	.r3 {
		color: #ffaa7f;
	}
}
</style>
